<!--
 * @Date: 2023-02-09 11:45:03
 * @LastEditTime: 2024-01-17 10:46:04
 * @Description: content
-->
<template>
  <div
    class="a-template common_bg"
    :style="{
      backgroundImage: `url(${$img1('/static/img2/tag_bg.png')})`
    }"
    :style="{
      backgroundImage: `url(${$img1('/static/img2/idx_banner_bg.png')})`
    }"
  >
    <mescroll-body
      ref="mescrollRef"
      @init="mescrollInit"
      @down="downCallback"
      @up="getList"
      :down="downOption"
      :up="upOption"
    ></mescroll-body>

    <mescroll-uni
      class="log-list-wrap"
      height="50%"
      ref="listScroll"
      @init="mescrollInit"
      @down="downCallback"
      @up="getList"
      :down="downOption"
      :up="upOption"
    ></mescroll-uni>

    <uni-nav-bar
      title="签到任务"
      color="#fff"
      backgroundColor="transparent"
      :border="false"
      :statusBar="true"
      :fixed="true"
      @clickLeft="$c.back()"
    >
      <view class="uni-nav-bar-l-icon" slot="left">
        <view class="uni-nav-bar-l-icon-left icon">
          <image :src="$img1('/static/img2/cc20.png')" lazy-load></image>
        </view>
      </view>
    </uni-nav-bar>

    <uni-nav-bar
      :title="'收货评价'"
      color="#333"
      leftIcon="left"
      backgroundColor="transparent"
      :border="false"
      :statusBar="true"
      :fixed="true"
      @clickLeft="$c.back()"
    ></uni-nav-bar>

    <image :src="$img1('/static/img2/tag_bg.png')" lazy-load></image>

    <image :src="$img1('/static/zzz.png')" lazy-load></image>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  name: 'a-template',
  components: {},
  props: {},
  data() {
    return {
      // 下拉刷新的配置(可选, 绝大部分情况无需配置)
      downOption: {
        auto: false
      },
      // 上拉加载的配置(可选, 绝大部分情况无需配置)
      upOption: {
        auto: true,
        page: {
          size: 10 // 每页数据的数量,默认10
        }
      },
      listData: []
    }
  },

  computed: {
    ...mapGetters(['sysConfig', 'zimgUrl'])
  },

  onLoad(options) {
    this.optionsData = options

    this.mescroll.resetUpScroll()
    this.mescroll.scrollTo(0, 0)
  },

  methods: {
    to() {
      this.$c.to({
        type: 1,
        url: '',
        query: {}
      })
    },

    /**
     * @description: 获取数据
     * @return {*}
     */
    getData() {
      this.req({
        url: '',
        data: {},
        success: res => {
          if (res.status == 1) {
            this.pageData = res.data
          }
        }
      })
    },

    /**
     * @description: 获取列表
     * @param {*} num
     * @param {*} size
     * @return {*}
     */
    getList({ num, size }) {
      this.req({
        url: '',
        data: {
          page: num,
          limit: size
        },
        Loading: true,
        success: res => {
          if (res.status == 1) {
            if (num == 1) {
              this.listData = []
            }

            this.listData = this.listData.concat(res.data.data)
            this.mescroll.endByPage(res.data.data.length, res.data.last_page)
          }
        }
      })
    }
  },
  watch: {},

  // 页面周期函数--监听页面加载
  onLoad() {},
  // 页面周期函数--监听页面初次渲染完成
  onReady() {},
  // 页面周期函数--监听页面显示(not-nvue)
  onShow() {},
  // 页面周期函数--监听页面隐藏
  onHide() {},
  // 页面周期函数--监听页面卸载
  onUnload() {}
  // 页面处理函数--监听用户下拉动作
  // onPullDownRefresh() { uni.stopPullDownRefresh(); },
  // 页面处理函数--监听用户上拉触底
  // onReachBottom() {},
  // 页面处理函数--监听页面滚动(not-nvue)
  // onPageScroll(event) {},
  // 页面处理函数--用户点击右上角分享
  // onShareAppMessage(options) {},
}
</script>

<style lang="scss">
template {
  background: linear-gradient(180deg, #150e02, #795b14);
  background: linear-gradient(133deg, #f9dcaa 0%, #ffa64a 100%);
}
</style>
